document.addEventListener('DOMContentLoaded', function () {


    //模拟封装jQuery $
    function $key(getkeys) {
        return document.querySelector(getkeys);
    }


    // 提取日期相关函数
    date();
    function date() {
        var spa = document.querySelector(".dater");
        var timer = null;
        // 封装时间日期格式化
        function mydate() {
            var date = new Date();
            // 时间日期格式化 yyyy-mm-dd hh:mm:ss
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var data = date.getDate();
            var hours = date.getHours();
            var minutes = date.getMinutes();
            var seconds = date.getSeconds();
            // 补 0
            month = (month < 10) ? "0" + month : month;
            data = (data < 10) ? "0" + data : data;
            hours = (hours < 10) ? "0" + hours : hours;
            minutes = (minutes < 10) ? "0" + minutes : minutes;
            seconds = (seconds < 10) ? "0" + seconds : seconds;
            var res = `${year}年${month}月${data}日 ${hours}:${minutes}:${seconds}`;
            return res;
        }
        function automove() {
            spa.innerHTML = mydate();
        }
        // 自动走
        setInterval(automove, 1000);
    }


    //添加内容
    var diarrtop = document.getElementsByClassName("diarr-top")[0];
    diarrtop.innerHTML = `
            <div class="Lines"></div>
            <p class="penc">日志系统</p>
            <h5 class="picle">发布日志</h5>
    `
    var diarrbott = document.getElementsByClassName("diarr-bottom")[0];
    diarrbott.innerHTML = `
        <table>
              <thead>
                <tr>
                  <th>姓名</th>
                  <th>性别</th>
                  <th>班级</th>
                  <th>时间</th>
                  <th>内容</th>
                </tr>
              </thead>
              <tbody class="faker"></tbody>
              <tfoot>
                <tr>
                  <th  colspan="5">
                    <button id="uper5">&lt;</button>
                    <div class="age5"></div>
                    <button id="nexter5">&gt;</button>
                  </th>
                </tr>
              </tfoot>
            </table>
    `


    //AJAX调接口
    var pageIndex = 1;
    var pageSize = 10;
    function diaryList() {
        $key(".faker").innerHTML = "";
        $key(".age5").innerHTML = "";
        var cwr = {
            pageIndex: pageIndex,
            pageSize: pageSize
        }
        ajax.post("http://192.168.199.101:8080/BaorSystem/log/logList", cwr, function (res) {
            if (res.code == 200) {
                console.log(res);
                pageCount = res.dataset.pageCount;
                for (var i = 0; i < pageCount; i++) {
                    //创建元素
                    btn = document.createElement("button");
                    btn.innerHTML = i + 1;
                    var age5 = document.getElementsByClassName("age5")[0];
                    age5.appendChild(btn);
                }
                for (var item of res.dataset.logList) {
                    var newTr5 = document.createElement("tr");
                    newTr5.innerHTML = `
                        <td>${item.logUserName}</td>
                        <td>${item.userSex}</td>
                        <td>${item.logClazz}</td>
                        <td>${item.createTime}</td>
                        <td>${item.logCount}</td>
                    `
                    $key(".faker").appendChild(newTr5);
                }
            }
        })
    }
    diaryList();
    pagination()


    //分页
    function pagination() {
        $key("#nexter5").onclick = function () {//下一页
            pageIndex++;
            if (pageIndex >= pageCount) {
                pageIndex = pageCount;
                this.disabled = true;
            }
            $key("#uper5").disabled = false;
            // btn.style.backgroundColor="red";
            diaryList();
        }
        $key("#uper5").onclick = function () {//上一页
            pageIndex--;
            if (pageIndex <= 1) {
                pageIndex = 1;
                this.disabled = true;
            }
            $key("#nexter5").disabled = false;
            diaryList();
        }
    }


    //模态框
    var picle = document.getElementsByClassName("picle")[0];
    picle.onclick = function () {
        myModel(
            {
                mask: true,//显示蒙版
                title: "发布日志",//标题
                content_item1: `
                    <div class="lpl">
                        <div class="gender">姓名：</div><input type="text" id="username" class="kyama username" placeholder="默认登录用户">
                        <div class="gender lck">时间：</div><input type="text" id="useraccount" class="kyama useraccount" placeholder="默认当前日期">
                        <div class="gender">标识：</div><select type="text" id="pwd" class="kyama pwd">
                                <option value="3">学生</option>
                                <option value="2">老师</option>
                            </select>
                        <div class="gender lck">班级：</div><select id="sex" class="kyama sex">
                                <option value="3">全栈前端班</option>
                                <option value="1">UI设计</option>
                                <option value="2">web前端班</option>
                            </select>
                        <div class="gender">性别：</div><select id="dept" class="kyama lol">
                                <option value="1">男生</option>
                                <option value="2">女生</option>
                            </select>
                        <div class="gender lck lbl">内容：</div><input type="text" id="phone" class="kyama lec phone">
                    </div>
                `,
                content_item2: `
                    <button class="sure btn">确定</button>
                    <button class="btn one">取消</button>
                `,
            }

        )
        var sure = document.getElementsByClassName("sure")[0];
        sure.onclick = function () {
            var useraccount = document.getElementsByClassName("useraccount")[0];
            var sex = document.getElementsByClassName("sex")[0];
            var phone = document.getElementsByClassName("phone")[0];
            var useraccount = document.getElementsByClassName("useraccount")[0];
            var username=document.getElementsByClassName("username")[0];
            var alls = {
                logUserName: localStorage.getItem("username"),
                logClazz: Number(sex.value),
                logCount: phone.value,
                logStatus: 0
            }
            ajax.post("http://192.168.199.101:8080/BaorSystem/log/insertLog", alls, function (res) {
                console.log(res);
            })
        }
    }


    // 添加点击事件
    //日志系统
    var journal = document.getElementsByClassName("journal")[0];
    journal.onclick = function () {
        location.href = "./diary.html";
    }
    //首页
    var classs = document.getElementsByClassName("classs");
    classs[0].onclick = function () {
        location.href = "./header.html";
    }
    //日常
    var routine = document.getElementsByClassName("routine")[0];
    routine.onclick = function () {
        location.href = "./vacate.html";
    }
    //系统设置
    var system = document.getElementsByClassName("system")[0];
    system.onclick = function () {
        location.href = "./setting.html";
    }
    //项目管理
    var project = document.getElementsByClassName("project")[0];
    project.onclick = function () {
        location.href = "./projectmanagement.html";
    }
    //请假记录
    var excused = document.querySelector(".excused");
    excused.addEventListener('click', function () {
        location.href = "./vacate.html";
    });
    //考勤记录
    var presence = document.querySelector(".presence");
    presence.addEventListener('click', function () {
        location.href = "./clock.html";
    });
});